<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title>视频详细</title>
	<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0"/>
	<meta name="format-detection" content="telephone=no">
	<meta name="format-detection" content="email=no">
	<link rel="stylesheet" href="../../css/frozen.css">
	<link rel="stylesheet" href="../../css/main.css">
</head>
<body>
<section class="video">
	<div class="video-c"></div>
</section>

<section class="video-content">
	<div class="video-c-header">
		<div class="v-c-tit">
			<time>发布时间：2016-05-08</time>
			<div class="ctrl">
				<i id="zan" class="iconfont icon-zan"></i>
				<i id="coll" class="iconfont icon-startlog"></i>
				<i id="share" class="iconfont icon-share"></i>
			</div>
		</div>
		<p class="v-c-body">办公室健身视频，走遍全球引人注目，一起来看看怎
			么个办公室轻运动吧！</p>
	</div>
	<div class="ui-tab">
		<ul class="ui-tab-nav ui-border-b">
			<li id="comNum" class="current">评论（0）</li>
			<li id="zanNum">赞（<span>19</span>）</li>
		</ul>
		<ul class="ui-tab-content fit-tab" style="width: 200%">
			<li class="current">
				<!-- 评论 start -->
				<ul class="ui-list ui-border-tb fit-ul-list">
					<li class="ui-border-t">
						<div class="ui-avatar">
							<span style="background-image:url(../../img/qb.jpg)"></span>
						</div>
						<div class="ui-list-info">
							<h4 class="ui-nowrap">Mr Toma <time class="log-time">16-05-06</time></h4>
							<p class="">这是内容，加ui-nowrap可以超出长度截断nowrap可以超出长度截断nowrap可以超出长度截断</p>
						</div>
					</li>
					<li class="ui-border-t">
						<div class="ui-avatar">
							<span style="background-image:url(../../img/qb.jpg)"></span>
						</div>
						<div class="ui-list-info">
							<h4 class="ui-nowrap">Mr Toma <time class="log-time">16-05-06</time></h4>
							<p class="">这是内容，加ui-nowrap可以超出长度截断nowrap可以超出长度截断nowrap可以超出长度截断</p>
						</div>
					</li>
					<li class="ui-border-t">
						<div class="ui-avatar">
							<span style="background-image:url(../../img/qb.jpg)"></span>
						</div>
						<div class="ui-list-info">
							<h4 class="ui-nowrap">Mr Toma <time class="log-time">16-05-06</time></h4>
							<p class="">这是内容，加ui-nowrap可以超出长度截断nowrap可以超出长度截断nowrap可以超出长度截断</p>
						</div>
					</li>
					<li class="ui-border-t">
						<div class="ui-avatar">
							<span style="background-image:url(../../img/qb.jpg)"></span>
						</div>
						<div class="ui-list-info">
							<h4 class="ui-nowrap">Mr Toma</h4>
							<p class="">这是内容，加ui-nowrap可以超出长度截断nowrap可以超出长度截断nowrap可以超出长度截断</p>
						</div>
					</li>
				</ul>
				<!-- 评论 end -->
			</li>

			<!-- 头像 start -->
			<li>
				<div class="head-waper">
					<span class="ui-avatar-tiled" data-id="asdfasdfads"><span style="background-image:url(http://placeholder.qiniudn.com/60x60)"></span></span>
					<span class="ui-avatar-tiled" data-id="asdfasdfads"><span style="background-image:url(http://placeholder.qiniudn.com/60x60)"></span></span>
					<span class="ui-avatar-tiled"><span style="background-image:url(http://placeholder.qiniudn.com/60x60)"></span></span>
					<span class="ui-avatar-tiled"><span style="background-image:url(http://placeholder.qiniudn.com/60x60)"></span></span>
					<span class="ui-avatar-tiled"><span style="background-image:url(http://placeholder.qiniudn.com/60x60)"></span></span>
					<span class="ui-avatar-tiled"><span style="background-image:url(http://placeholder.qiniudn.com/60x60)"></span></span>
					<span class="ui-avatar-tiled"><span style="background-image:url(http://placeholder.qiniudn.com/60x60)"></span></span>
					<span class="ui-avatar-tiled"><span style="background-image:url(http://placeholder.qiniudn.com/60x60)"></span></span>
					<span class="ui-avatar-tiled"><span style="background-image:url(http://placeholder.qiniudn.com/60x60)"></span></span>
					<span class="ui-avatar-tiled"><span style="background-image:url(http://placeholder.qiniudn.com/60x60)"></span></span>
					<span class="ui-avatar-tiled"><span style="background-image:url(http://placeholder.qiniudn.com/60x60)"></span></span>
					<span class="ui-avatar-tiled"><span style="background-image:url(http://placeholder.qiniudn.com/60x60)"></span></span>
				</div>
			</li>
			<!-- 头像 end -->
		</ul>
	</div>
</section>

<section class="ui-footer ui-border-t fit-comment">
	<div class="ui-input ui-border-radius">
		<input id="comment" type="text" name="" value="" placeholder="我也说一句...">
	</div>
	<button id="commentBtn" class="fit-btn"><span class="iconfont icon-feiji"></span></button>
</section>

<div class="share">
	<img src="../../img/share.png" alt="分享"/>
</div>

<script src="../../lib/zepto.min.js"></script>
<script src="../../lib/layer.js"></script>
<script src="../../js/frozen.js"></script>
<script src="../../js/main.js"></script>
<script>
	/**
	 * @func tab
	 */
	window.addEventListener('load', function(){
		var tab = new fz.Scroll('.ui-tab', {
			role: 'tab',
			interval: 3000
		});
	});

	/* 点赞 */
	var zan = new Zan('#zan','zan','video_home.html',{
		userId:'111', // *用户ID
		userHead:'../../img/qb.jpg' // *用户头像
	});
	zan.init();
	/* 收藏 */
	var coll = new Zan('#coll','coll','video_home.html',{
		userId: '111'
	});
	coll.init();
	/* 启动时计算数据 */
	loadNmber();
	/* 分享 */
	share.event();

	/* 评论 */
	comment.init('video_home.html',{
		userName:'世界要革命', // *用户姓名
		userHead:'../../img/imgbg1.jpg' // *用户头像
	});

</script>
</body>
</html>